<template>
    <div>
        <div class="jc">
            <span>
                <h2 >用户列表 - 密码重置 - 账号冻结</h2>
            </span>
        </div>
        <div style="margin:5px">
            <el-table border :data="userInfo">
                <el-table-column prop="id" label="ID" min-width="5%"></el-table-column>
                <el-table-column prop="nickname" label="用户名" min-width="15%"></el-table-column>
                <el-table-column prop="account" label="账号" min-width="20%"></el-table-column>
                <el-table-column prop="phone" label="电话" min-width="20%"></el-table-column>
                <el-table-column label="账号状态" min-width="10%">
                    <template slot-scope="scope">
                        {{scope.row.closed==1?'冻结中':'正常'}}
                    </template>
                </el-table-column>
                <el-table-column label="操作" min-width="30%">
                    <template slot-scope="scope">
                        <el-dialog title="收货地址" :visible.sync="dialogTableVisible">
                            <!-- <el-table :data="gridData">
                                <el-table-column property="date" label="日期" width="150"></el-table-column>
                                <el-table-column property="name" label="姓名" width="200"></el-table-column>
                                <el-table-column property="address" label="地址"></el-table-column>
                            </el-table> -->
                        </el-dialog>
                        <el-button type="success" size="small" @click="orderInfo(scope.row.id);dialogTableVisible=true">订单信息</el-button>
                        <el-button type="primary" size="small" @click="pawReset(scope.row)">密码重置(解冻)</el-button>
                        <el-button type="warning" v-if="scope.row.closed!=1" size="small" @click="freeze(scope.row)">冻结此账号</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div style="width:25%;margin:10px auto">
                <el-pagination background  :page-size="num"
                    @current-change="pageChange"
                    layout="prev, pager, next" :total="total">
                </el-pagination>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        name:'',
        props:[],
        data() {
            return {
                userInfo:[],
                total:0,
                num:5,
                dialogTableVisible:false
            }
        },
        methods:{
            pageChange(n){
                var that = this
                this.$postX("/api/adm/user/findAll/"+that.num*(n-1)+"/"+that.num)
                .then(function(resp){
                    that.userInfo = resp.data.data.users
                })
            },
            //用户订单信息
            orderInfo(id){
                var that = this
                this.$get("/api/adm/user/findByIdUserInfo/"+id)
                .then(function(resp){
                    console.log(resp.data.data);
                })
            },
            //用户重置密码
            pawReset(user){
                var that = this
                this.$get("/api/adm/user/resetPwd/"+user.id)
                .then(function(resp){
                    if(resp.data.data==1){
                        that.$message({
                            message: '密码重置,解冻账号成功',
                            type: 'success'
                        });   
                        that.userInfo[that.userInfo.indexOf(user)].closed = 0
                    }
                })
            },

            //解冻此用户
            freeze(user){
                var that = this
                this.$get("/api/adm/user/close/"+user.id)
                .then(function(resp){
                    if(resp.data.data==1){
                        that.$message({
                            message: '冻结账号成功',
                            type: 'success'
                        });
                        that.userInfo[that.userInfo.indexOf(user)].closed = 1
                    }
                })
            },
        },

        mounted(){
            var that = this
            this.$postX("/api/adm/user/findAll/0/"+that.num)
            .then(function(resp){
                that.userInfo = resp.data.data.users
                that.total = resp.data.data.total
            })
        }
    }
</script>
<style scoped="scoped">
.jc{
        display: flex;
        margin: 0 5px;
        justify-content:space-between;
        border-bottom: 2px solid gray;
    }
</style>
